<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">

    <title>注册</title>

    <link href="css/style.css" rel="stylesheet" th:href="@{/css/style.css}">
    <link href="css/style-responsive.css" rel="stylesheet" th:href="@{/css/style-responsive.css}">

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->
</head>

<body class="login-body">

<div class="container">

    <form class="form-signin" action="/index/register" method="post" name="reg" onsubmit="return check()">
        <div class="form-signin-heading text-center">
            <h1 class="sign-title">新用户注册</h1>
        </div>

        <div class="login-wrap">
            <p>输入您的个人信息</p>
            <input type="text" autofocus="" placeholder="学号" class="form-control" name="stuId">
            <span style="color: red" th:if="${not #strings.isEmpty(em_id)}" th:text="${em_id}"></span>
            <input type="text" autofocus="" placeholder="姓名" class="form-control" name="stuName">
            <input type="text" autofocus="" placeholder="邮箱" class="form-control" name="stuEmail">
            <input type="text" autofocus="" placeholder="电话号码" class="form-control" name="stuPhone">
            <input type="password" placeholder="密码" class="form-control" name="stuPassword">
            <input type="password" placeholder="确认密码" class="form-control" name="rePassword">
            <select name="stuMajor" class="form-control">
                <option th:each="major : ${majors}" th:value="${major.mjName}" th:text="${major.mjName}"></option>
            </select>
            <br>
            <div class="radios">
                <label for="radio-01" class="label_radio col-lg-6 col-sm-6">
                    <input type="radio" checked="" value="男" id="radio-01" name="stuSex"> 男
                </label>
                <label for="radio-02" class="label_radio col-lg-6 col-sm-6">
                    <input type="radio" value="女" id="radio-02" name="stuSex"> 女
                </label>
            </div>
            <br>
            <!--<label class="checkbox">
                <input type="checkbox" value="agree this condition"> 我同意服务条款和隐私政策
            </label>-->
            <button type="submit" class="btn btn-lg btn-login btn-block">
                <i class="fa fa-check"></i>
            </button>

            <div class="registration">
                已经注册。
                <a th:href="@{/index/stuLogin}" class="">
                    去登陆
                </a>
            </div>

        </div>

    </form>

</div>


<!-- Placed js at the end of the document so the pages load faster -->

<!-- Placed js at the end of the document so the pages load faster -->
<script src="js/jquery-1.10.2.min.js" th:src="@{/js/jquery-1.10.2.min.js}"></script>
<script src="js/bootstrap.min.js" th:src="@{/js/bootstrap.min.js}"></script>
<script src="js/modernizr.min.js" th:src="@{/js/modernizr.min.js}"></script>

<!--表单验证-->
<script>
    function check() {
        var form = document.forms["reg"];
        var stuId = form["stuId"].value;
        if (stuId == null || stuId == "") {
            alert("学号不能为空");
            return false;
        }
        var stuPassword = form["stuPassword"].value;
        var rePassword = form["rePassword"].value;
        if (stuPassword == null || stuPassword == "") {
            alert("密码不能为空");
            return false;
        }
        var pLen = stuPassword.length;
        if(pLen < 9 || pLen > 19){
            alert("密码的长度要在8-18位之间哦~");
            return false;
        }
        if (stuPassword != rePassword) {
            alert("两次密码不一致");
            return false;
        }
        var stuName = form["stuName"].value;
        if (stuName == null || stuName == "") {
            alert("姓名不能为空");
            return false;
        }
        var stuEmail = form["stuEmail"].value;
        if (stuEmail == null || stuEmail == "") {
            alert("邮箱不能为空");
            return false;
        }
        var atpos = stuEmail.indexOf("@");
        var dotpos = stuEmail.lastIndexOf(".");
        if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= stuEmail.length) {
            alert("不是一个有效的 e-mail 地址");
            return false;
        }
        var stuPhone = form["stuPhone"].value;
        if (stuPhone == null || stuPhone == "") {
            alert("电话不能为空");
            return false;
        }
    }
</script>
</body>
</html>
